<template>
    <div class="list">
        <ul class="mqw_ul">
            <li v-for="item in list" :key="item.id">
                <img :src="item.author.avatar_url" alt="" />
                <div>
                    <span>{{ item.title }}</span>
                    <span>{{ item.create_at }}</span>
                </div>
            </li>
        </ul>
    </div>
</template>

<script>
export default {
    props: ["list"],
    data() {
        return {};
    },
    mounted() {},
    methods: {},
};
</script>

<style lang="scss">
.mqw_ul {
    width: 100%;
    li {
        width: 100%;
        height: 50px;
        // background-color: green;
        margin-top: 10px;
        display: inline-flex;
        justify-content: space-between;
        align-items: center;
        img {
            width: 15%;
            height: 100%;
        }
        div {
            width: 80%;
            height: 100%;
            display: inline-flex;
            justify-content: space-between;
            align-items: center;
            font-size: 15px;
        }
    }
}
</style>
